<include file="Public/header" />
<body onselectstart="return false">
<div class="main FromUpToDown" >
    <div class="content" style="position: relative">
        <div class="head-content">
            <div class="head-title">
                <span><{:ACTION_NAME == 'edit' ? '修改' : '添加'}>短信内容</span>
            </div>
        </div>
        <form action='' id="form" >
            <input type="hidden" name="id" value="<{$info['id']}>">
            <div class="form-content">
                <div class="form">
                    <div class="form-left">短信模板</div>
                    <div class="form-right">
                        <select class="form-input-small" name="template_id" id="template_id" >
                            <option value="">请选择短信模板</option>
                            <foreach name="template" item="vo">
                                <option <{:$info['template_id'] == $vo['id'] ? 'selected' : ''}> value="<{$vo['id']}>"><{$vo['name']}></option>
                            </foreach>
                        </select>
                    </div>
                    <div class="form-left">短信名称</div>
                    <div class="form-right">
                        <input class="form-input-small" value="<{$info['name']}>"  type="text" name="name" id="name">
                    </div>
                </div>
                <div class="form">
                    <div>
                    <div class="form-left">模板内容</div>
                    <div style="margin-left: 93px" >
                        <textarea name="" readonly id="template_content"  cols="40" rows="8"><{$info['template']['content']}></textarea>
                    </div>
                    </div>
                    <div>
                    <div class="form-left" style="text-align: left;padding-left: 51px;">短信内容<span  style="color:red" id="mess_long"></span></div>
                    <div class="form-right" style="margin-left: 51px">
                        <textarea name="content"  id="mess_content"  cols="40" rows="8"><{$info['content']}></textarea>
                    </div>
                    </div>
                </div>
                <div class="form">
                    <div class="form-left">参数1</div>
                    <div class="form-right">
                        <input class="form-input-small" id="one_para" type="text" name="one_para" value="<{$info['one_para']}>">
                    </div>
                    <div class="form-left">参数2</div>
                    <div class="form-right">
                        <input class="form-input-small" id="two_para" type="text" name="two_para" value="<{$info['two_para']}>">
                    </div>
                </div>
                <div class="form">
                    <div class="form-left">参数3</div>
                    <div class="form-right">
                        <input class="form-input-small" id="three_para" type="text" name="three_para" value="<{$info['three_para']}>">
                    </div>
                    <div class="form-left">参数4</div>
                    <div class="form-right">
                        <input class="form-input-small" id="four_para" name="four_para" type="<{$info['four_para']}>">
                    </div>
                </div>

                <div class="form-operate">
                    <button type='button' id="save"  class="form-button color-bg-green">保存</button>
                    <button type='button' onclick="history.go(-1)" class="form-button color-bg-grey">返回</button>
                </div>
            </div>
        </form>
    </div>
</div>
<include file="Public/footer"  />
<script>
    //获取模板对象,用于处理短信内容(angularjs还没看好就先写成这个吊样吧)
    var template_id = "<{$info['template_id']}>"; //短信模板id
    var template_content = '';//短信模板内容
    var mess_content = '';//短信内容
    var one_para = '';//参数1
    var two_para = '';//参数2
    var three_para = '';//参数3
    var four_para = '';//参数4
    var template_list = <{:json_encode($template)}>;
    var template = {};
    if(template_list) {
        for (var i = 0; i < template_list.length; i++) {
            var id = template_list[i].id;
            template[id] = template_list[i].content;
        }
    }
    $("#template_id").change(function(){
        template_id = $(this).val();
        if(!template_id) return;
        template_content = template[template_id];
        $("#template_content").html(template_content);
        mess_content = template_content;
        if($("#one_para").val()){
            mess_content = mess_content.replace('{1}',$("#one_para").val());
        }
        if($("#two_para").val()){
            mess_content = mess_content.replace('{2}',$("#two_para").val());
        }
        if($("#three_para").val()){
            mess_content = mess_content.replace('{3}',$("#three_para").val());
        }
        if($("#four_para").val()){
            mess_content = mess_content.replace('{4}',$("#four_para").val());
        }
        $("#mess_content").html(mess_content);
    });

    $("#one_para,#two_para,#three_para,#four_para").bind("input propertychange",function(){
        if(!template_content){
            if(!template_id){return;}
            template_content = template[template_id];
        }
        mess_content = template_content;
        if($("#one_para").val()){
            mess_content = mess_content.replace('{1}',$("#one_para").val());
        }
        if($("#two_para").val()){
            mess_content = mess_content.replace('{2}',$("#two_para").val());
        }
        if($("#three_para").val()){
            mess_content = mess_content.replace('{3}',$("#three_para").val());
        }
        if($("#four_para").val()){
            mess_content = mess_content.replace('{4}',$("#four_para").val());
        }
        $("#mess_content").html(mess_content);
    });


    $("#save").click(function () {
        if(!$("#template_id").val()){
            layer.tips('请选择模板！', '#template_id', {tips: [2, 'red'], time: 1000});
            return;
        }
        if(!$("#name").val()){
            layer.tips('请填写短信名称！', '#name', {tips: [2, 'red'], time: 1000});
            return;
        }
        $("#save").attr('disabled',true);
        $.post(
                "<{:U('save')}>",
                $("#form").serialize(),
                function(res){
                    if(res.status == 1){
                        layer.tips(res.info, '#save', {tips: [2, 'green'], time: 1000});
                        setTimeout("location.href = document.referrer",1000);
                    }else{
                        $("#save").attr('disabled',false);
                        layer.tips(res.info, '#save', {tips: [2, 'red'], time: 1000});
                    }
                }
        );
    });
    setInterval("show()",1000)
    function show(){
        var mess_long = $("#mess_content").html().length;
        if(!mess_long){
            $("mess_long").html('');
            return;
        }
        if(mess_long > 60){
            $("#mess_long").html("(两条短信记录)");
        }else if(mess_long <60){
            $("#mess_long").html("(一条短信记录)");
        }
    }

</script>
</body>
</html>